$(binding);

//用于拼接需要轮播的div
var slide_div = "";
//当前出现的div，从0开始
var index = 0;
//位移值
var left = 0;
//div默认宽度
var div_width = 700;
//轮播div总数量
var div_count = 0;
//是否支持transform
var sup_transform = true;
if('MozTransform' in document.documentElement.style 
		|| 'WebkitTransform' in document.documentElement.style 
		|| 'OTransform' in document.documentElement.style 
		|| 'msTransform' in document.documentElement.style){
	sup_transform = true;
}else{
	sup_transform = false;
}
function binding() {
	$("body").delegate(".thumbnail","click",function(){
		init();
		var bigUrl = "";
		var type = "";
		$(this).parent().find("div").each(function(index){
			bigUrl = this.id;
			//图片
			if(bigUrl.lastIndexOf(".mp4") < 0){
				slide_div = slide_div + "<div id='rotate" + index + "' style='background:url(" + bigUrl + ") no-repeat center;background-size:contain;' alt='1'></div>";
			}else{ //视频
				slide_div = slide_div + "<div id='rotate" + index + "' alt='1'><video src='"+bigUrl+"' width='100%' height='100%' controls='controls'></div>";
			}
		});
		initSlide();
		showImg($(this).attr("index"));
	});
	$("body").delegate(".thumbnail2","click",function(){
		init();
		var bigUrl = "";
		var type = "";
		bigUrl = this.id;
		//图片
		if(bigUrl.lastIndexOf(".mp4") < 0){
			slide_div = slide_div + "<div id='rotate" + index + "' style='background:url(" + bigUrl + ") no-repeat center;background-size:contain;' alt='1'></div>";
		}else{ //视频
			slide_div = slide_div + "<div id='rotate" + index + "' alt='1'><video src='"+bigUrl+"' width='100%' height='100%' controls='controls'></div>";
		}
		initSlide();
		showImg($(this).attr("index"));
	});
	
	$(".l_point").click(function() {
		if (index != 0) {
			index -= 1;
		}
		left = -index * div_width;
		$(".slider").css("transition", "transform 0.5s linear");
		$(".slider").css("-webkit-transition", "-webkit-transform 0.5s linear");
		$(".slider").css("-moz-transition", "-moz-transform 0.5s linear");
		$(".slider").css("-ms-transition", "-ms-transform 0.5s linear");
		$(".slider").css("transform", "translate3d(" + left + "px, 0, 0)");
		$(".slider").css("-webkit-transform", "translate3d(" + left + "px, 0, 0)");
		$(".slider").css("-moz-transform", "translate3d(" + left + "px, 0, 0)");
		//IE9
		$(".slider").css("-ms-transform", "translateX(" + left + "px)");
		//IE9以下
		if(!sup_transform){
			$(".slider").css("left", left);
		}
		$("#imgIndex").text(index + 1 + "/" + div_count);
		if (index == 0) {
			$("#lout").show();
			$("#lover").hide();
		} else {
			$("#lover").show();
		}
	});
	$(".r_point").click(function() {
		if (index != $(".slider div").length - 1) {
			index += 1;
		}
		left = -index * div_width;
		$(".slider").css("transition", "transform 0.5s linear");
		$(".slider").css("-webkit-transition", "-webkit-transform 0.5s linear");
		$(".slider").css("-moz-transition", "-moz-transform 0.5s linear");
		$(".slider").css("-ms-transition", "-ms-transform 0.5s linear");
		$(".slider").css("transform", "translate3d(" + left + "px, 0, 0)");
		$(".slider").css("-webkit-transform", "translate3d(" + left + "px, 0, 0)");
		$(".slider").css("-moz-transform", "translate3d(" + left + "px, 0, 0)");
		//IE9
		$(".slider").css("-ms-transform", "translateX(" + left + "px)");
		//IE9以下
		if(!sup_transform){
			$(".slider").css("left", left);
		}
		$("#imgIndex").text(index + 1 + "/" + div_count);
		if (index + 1 == div_count) {
			$("#rout").show();
			$("#rover").hide();
		} else {
			$("#rover").show();
		}
	});
	$(".l_point").mouseover(function() {
		if (index == 0) {
			$("#lout").show();
		} else {
			$("#lover").show();
		}
	});
	$(".l_point").mouseout(function() {
		$("#lover").hide();
		$("#lout").hide();
	});
	$(".r_point").mouseover(function() {
		if (index + 1 == div_count) {
			$("#rout").show();
		} else {
			$("#rover").show();
		}
	});
	$(".r_point").mouseout(function() {
		$("#rover").hide();
		$("#rout").hide();
	});
}

//初始化图片轮播参数
function init() {
	slide_div = "";
	index = 0;
	left = 0;
	$(".slider").css("transform", "translate3d(0, 0, 0)");
	$(".slider").css("-webkit-transform", "translate3d(0, 0, 0)");
	$(".slider").css("-moz-transform", "translate3d(0, 0, 0)");
}
// 图片加载完成后，初始化slider,拼接slider_div
function initSlide() {
	$(".slider").html("");
	$(".slider").append(slide_div);
	div_count = $(".slider div").length;
	$(".slider").css("width", div_count * div_width);
}

function showImg(no) {
	index = parseInt(no);
	$("#imgIndex").text(index + 1 + "/" + div_count);
	$(".slider").css("transform", "translate3d(" + -index * div_width + "px, 0, 0)");
	$(".slider").css("-webkit-transform", "translate3d(" + -index * div_width + "px, 0, 0)");
	$(".slider").css("-moz-transform", "translate3d(" + -index * div_width + "px, 0, 0)");
	//IE9
	$(".slider").css("-ms-transform", "translateX(" + -index * div_width + "px)");
	//IE9以下
	if(!sup_transform){
		$(".slider").css("left", -index * div_width);
	}
	$("#bigImgModal").modal('show');
}
//旋转
function imgRotate(){
	var rotateIndex=parseInt($("#rotate"+index).attr("alt"));
	var rotateDeg=rotateIndex*90;
	var ieRotate=rotateIndex%4;
	if(ieRotate==0){
		ieRotate = 4;
	}
	$("#rotate"+index).css("-webkit-transform","rotate("+rotateDeg+"deg)");
	$("#rotate"+index).css("-moz-transform","rotate("+rotateDeg+"deg)");
	$("#rotate"+index).css("filter","progid:DXImageTransform.Microsoft.BasicImage(rotation="+ieRotate+")");
	$("#rotate"+index).css("transition","transform 0.5s linear");
	$("#rotate"+index).css("-moz-transition","-moz-transform 0.5s linear");
	$("#rotate"+index).css("-webkit-transition","-webkit-transform 0.5s linear");
	$("#rotate"+index).attr("alt",rotateIndex+1);
}

